<template>
  <div class="">
    <h1>商品管理--添加商品</h1>
    <div>
      商品名称<el-input placeholder="请输入内容" clear="inp"></el-input>
      商品描述<el-input clear="inp" placeholder="请输入内容"></el-input>
      所属分类
      <select name="" id="">
        <option value="">请选择一级商品</option>
        <option v-model="val" v-for="item in list" :key="item.id">
          {{ item.name }}
        </option>
      </select>
      <select name="" id="">
        <option value="">请选择二级商品</option>
        <option v-for="item in list" :key="item.id">{{ item.name }}</option>
      </select>
      <p></p>
      商品价格 <input type="number" name="" id="" /><br />
      商品库存<input type="number" name="" id="" /><br />
      商品详情<el-input
        type="textarea"
        :autosize="{ minRows: 2, maxRows: 4 }"
        placeholder="请输入内容"
      >
      </el-input>
      <el-button type="primary">添加</el-button>
    </div>
  </div>
</template>

<script>
import { Row, Col, Button, Form, FormItem, Input } from "element-ui";
import { tian } from "@/api/index";
export default {
  data() {
    return {
      list: "",
      val: "",
    };
  },
  components: {
    [Row.name]: Row,
    [Col.name]: Col,
    [Button.name]: Button,
    [Form.name]: Form,
    [Input.name]: Input,
    [FormItem.name]: FormItem,
  },
  mounted() {
    tian().then((res) => {
      console.log(res);
      this.list = res.data.data;
    });
  },
  methods: {},
};
</script>

<style lang='scss'>
.el-input__inner {
  width: 50%;
}
.el-textarea__inner {
  width: 50%;
  margin-left: 280px;
}
</style>
